import 'package:ducafe_ui_core/ducafe_ui_core.dart';
import 'package:flutter/material.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';
import 'package:flutter_svg/svg.dart';

import '../../common/index.dart';
import '../index.dart';

class MainContainer extends ConsumerWidget {
  const MainContainer({super.key});

  @override
  Widget build(BuildContext context, WidgetRef ref) {
    final navigationState = ref.watch(navigationProvider);
    final navigationNotifier = ref.read(navigationProvider.notifier);

    return Scaffold(
      extendBody: true,
      body: _buildCurrentPage(navigationState.currentTab, ref),
      bottomNavigationBar: Container(
        height: 100.h,
        alignment: Alignment.topCenter,
        child: Container(
          width: 280.w,
          height: 69.h,
          decoration: ShapeDecoration(
            color: Colors.black,
            shape: RoundedRectangleBorder(
              side: BorderSide(width: 1, color: const Color(0xFFFFAD3B)),
              borderRadius: BorderRadius.circular(20.r),
            ),
            shadows: [
              BoxShadow(
                color: Color(0x2B8251DE),
                blurRadius: 5.60,
                offset: Offset(-3, 3),
                spreadRadius: 0,
              ),
            ],
          ),
          child: Row(
            mainAxisAlignment: MainAxisAlignment.spaceBetween,
            crossAxisAlignment: CrossAxisAlignment.center,
            children: [
              _buildNavigationItem(
                icon: MyIcons.home,
                tab: NavigationTab.home,
                isSelected: navigationState.currentTab == NavigationTab.home,
                onTap: () => navigationNotifier.switchTab(NavigationTab.home),
              ),
              _buildNavigationItem(
                icon: MyIcons.time,
                tab: NavigationTab.time,
                isSelected: navigationState.currentTab == NavigationTab.time,
                onTap: () => navigationNotifier.switchTab(NavigationTab.time),
              ),
              _buildNavigationItem(
                icon: MyIcons.square,
                tab: NavigationTab.square,
                isSelected: navigationState.currentTab == NavigationTab.square,
                onTap: () => navigationNotifier.switchTab(NavigationTab.square),
              ),
              _buildNavigationItem(
                icon: MyIcons.my,
                tab: NavigationTab.my,
                isSelected: navigationState.currentTab == NavigationTab.my,
                onTap: () => navigationNotifier.switchTab(NavigationTab.my),
              ),
            ],
          ),
        ),
      ),
    );
  }

  Widget _buildNavigationItem({
    required String icon,
    required NavigationTab tab,
    required bool isSelected,
    required VoidCallback onTap,
  }) {
    return GestureDetector(
      onTap: onTap,
      behavior: HitTestBehavior.opaque,
      child: SizedBox(
        width: 67.w,
        height: 67.h,
        child: isSelected
            ? Container(
                width: 67.w,
                height: 67.h,
                decoration: ShapeDecoration(
                  image: DecorationImage(
                    image: AssetImage(MyImages.mainBtBg),
                    fit: BoxFit.contain,
                  ),
                  shape: RoundedRectangleBorder(
                    borderRadius: BorderRadius.circular(20.r),
                  ),
                  shadows: [
                    BoxShadow(
                      color: Color(0x60FF8C00),
                      blurRadius: 14,
                      offset: Offset(-4, 1),
                      spreadRadius: 0,
                    ),
                  ],
                ),
                child: Padding(
                  padding: EdgeInsets.only(left: 4.w),
                  child: Center(
                    child: SvgPicture.asset(
                      icon,
                      width: 21.w,
                      height: 21.h,
                      fit: BoxFit.contain,
                    ),
                  ),
                ),
              )
            : Container(
                width: 67.w,
                height: 67.h,
                alignment: Alignment.center,
                child: Padding(
                  padding: EdgeInsets.only(left: 4.w),
                  child: SvgPicture.asset(
                    icon,
                    width: 21.w,
                    height: 21.h,
                    colorFilter: ColorFilter.mode(
                      Colors.white,
                      BlendMode.srcIn,
                    ),
                    fit: BoxFit.contain,
                  ),
                ),
              ),
      ),
    );
  }

  Widget _buildCurrentPage(NavigationTab currentTab, WidgetRef ref) {
    switch (currentTab) {
      case NavigationTab.home:
        return const HomePage();
      case NavigationTab.square:
        return const SquarePage();
      case NavigationTab.time:
        return const TimePage();
      case NavigationTab.my:
        return MyPage(key: ValueKey(currentTab));
    }
  }
}
